<template>
    <div class="confimDialogClass">
        <!-- 患者身份确认 -->
        <el-dialog title="" :visible.sync="configDialog.show" width="300px" :show-close="false" center
          top="2%"  :before-close="handleClose" >

            <div class="content">
                <div class="fw500 f18 tc mb20">接口地址配置</div>
                <div class="content_body">
                    <el-input placeholder="请输入接口地址" v-model="url" clearable></el-input>
                </div>
            </div>
            <span slot="footer" class="dialog-footer">
                <el-button  @click="handleClose">关 闭</el-button>
                <el-button  type="primary" @click="handleSure">确定</el-button>
            </span>
        </el-dialog>


    </div>
</template>

<script>
import { mapGetters,mapMutations } from 'vuex';


export default {
    data() {
        return {
            url: '',
           
        };
    },
    props: ['configDialog'],
    computed: {
        ...mapGetters(['loginInfo']),

    },
    watch: {
    
    },
    mounted() {
        this.userInfo = JSON.parse(this.loginInfo)

        
    },
    methods: {
        ...mapMutations({
            setUrl:'user/set_URL',
        }),
       
        handleClose() {
            this.$emit('close')
        },
        handleSure() {
            if(!this.url.startsWith('http://')&&!this.url.startsWith('https://'))
            {
                this.$message('无效的url格式','msg')
                return 
            }
            
            //验证url格式
            this.setUrl(this.url)
            this.$emit('close')

        },
       

    },
}
</script>
<style lang='less' scoped>
.confimDialogClass {
    ::v-deep .el-dialog {
        border-radius: 10px;
        // margin-left: 12.5px;
    }
    ::v-deep .el-dialog--center .el-dialog__body {
        padding: 0 15px 15px 15px;
        border-radius: 10px 10px 0 0;
        // border: ;
    }

    .content {
        padding-top: 10px;

        &_body {
            border-radius: 5px;
            background-color: #F5F7FA;
            padding: 30px 10px;
        }
    }

    ::v-deep .el-dialog__header {
        display: none;
    }

    .info {
        background-color: #F5F7FA;
        border-radius: 10px;

    }

    ::v-deep .el-dialog__footer {
        padding: 0 0 10px 0;
    }

    .dialog-footer {
        .el-button {
            width: 125px;
        }

        .longWidth {
            width: 270px;

        }

        .el-button--default {
            color: #1C8BE4;
        }
    }
}
</style>